<template>
    <div class="productProNew">
        <div class="title"><h1><span>出团通知</span></h1></div>
        <form name="notice" class="basicInfor">
            <h1 class="hide">线路名称(必填)</h1>
            <div class="form-group required clearfix">
                <label :for="'lineName'+$attrs.text">线路名称：</label>
                <span class="site-p">{{journey.title}}</span>
                <!--<input type="text" class="form-control proName" :id="'lineName'+$attrs.text" placeholder="" v-model="journey.title">-->
            </div>

            <h1 class="hide">往返航班(必填)</h1>
            <div class="form-group ">
                <label class="destxt" :for="'roundFlights'+$attrs.text">往返航班：</label>
                <textarea class="form-control proDes" :id="'roundFlights'+$attrs.text" rows="6" placeholder="请输入内容" v-model="journey.transportInfo"></textarea>
            </div>

            <h1 class="hide">集合安排(必填)</h1>
            <div class="form-group ">
                <label class="destxt" :for="'setPlan'+$attrs.text">集合安排：</label>
                <textarea class="form-control proDes" :id="'setPlan'+$attrs.text" rows="6" placeholder="请输入内容" v-model="journey.jiheInfo"></textarea>
            </div>

            <h1 class="hide">导游领队(必填)</h1>
            <div class="form-group ">
                <label class="destxt" :for="'tourLeader'+$attrs.text">导游领队：</label>
                <textarea class="form-control proDes" :id="'tourLeader'+$attrs.text" rows="6" placeholder="请输入内容" v-model="journey.talentInfo"></textarea>
            </div>

            <h1 class="hide">紧急电话(必填)</h1>
            <div class="form-group ">
                <label :for="'call'+$attrs.text">紧急电话：</label>
                <input type="text" class="form-control proName proDes" :id="'call'+$attrs.text" placeholder=""  v-model="journey.jinjiPhone">
            </div>

            <h1 class="hide">补充说明(必填)</h1>
            <div class="form-group ">
                <label class="destxt" :for="'addDes'+$attrs.text">补充说明：</label>
                <textarea class="form-control proDes" :id="'addDes'+$attrs.text" rows="6" placeholder="请输入内容" v-model="journey.remark"></textarea>
            </div>

            <button type="button" class="btn btn-info confirmBtn" @click="submitPro()">确定</button>
        </form>
    </div>
</template>
<script>
    export default {
        data(){
            return{
                Http:'',// 接口
                routeHttp:'', //提交接口
                journey:'',
            }
        },
        computed:{
            ChutuanView(){ //行程
                return this.$store.state.interface.xchChutuanView;
            },
            Chutuan(){ //行程提交
                return this.$store.state.interface.setXchChutuan;
            }
        },
        methods:{
            colorChange(event){
                event.target.style.color = '#7f889c';
            },
            ContactPhone(item,event){ //判断手机正确格式
                var pattern = /^1[35789]\\d{9}$/;
                if(item.replace(/(^s*)|(s*$)/g, "") == 0){
                    event.target.value='';
                    return;
                }else if(!pattern.test(item)){
                    layer.msg('请填写正确的手机号!');
                }
            },
            submitPro(){
                var self = this;
                event.preventDefault();   
                var formData =new FormData(); // 基础信息表单数据
                    formData.append('tid', this.journey.tid);
                    formData.append('xid', this.journey.xid);
                    formData.append('xchSn', this.journey.xchSn);
                    formData.append('keywords', this.journey.keywords);
                    formData.append('transportInfo', this.journey.transportInfo);
                    formData.append('jiheInfo', this.journey.jiheInfo);
                    formData.append('talentInfo', this.journey.talentInfo);
                    formData.append('remark', this.journey.remark);
                    formData.append('jinjiPhone', this.journey.jinjiPhone);
                    formData.append('status', this.journey.status);

                this.$ajax.post(self.routeHttp,formData).then(function(res) {
                    if(res.data.code == '10000' ){
                        layer.msg('修改成功!');
                    }else{
                        self.codes(res.data.code);
                        layer.msg('修改失败!');
                    }
                },function(res) {
                    layer.msg('服务器错误！');
                });
            },
        },
        beforeMount(){
            var self = this;
            var url = this.ChutuanView;
            var sessionId = JSON.parse(sessionStorage.getItem('customer')).sid;
            this.Http = url+'?sid='+sessionId; // 基础信息
            this.routeHttp = this.Chutuan +'?sid='+sessionId; // 行程
            // 行程获取
            self.$ajax.post(self.Http+'&xid='+self.$attrs.proid).then(function(res) {
                // console.log(res.data)
                if(res.data.code == '10000' ){
                    var ShowList = res.data.result;
                    for(var i in ShowList){
                        self.journey = ShowList[i];
                    };
                }else{
                    self.codes(res.data.code);
                    layer.msg('加载失败!');
                }
            },function(res) {
                layer.msg('服务器错误！');
            });
        },
        mounted(){
            //
        }
    }
</script>
<style lang="scss" scoped>
    .basicInfor{
        form{
            display:block;
        }
        .title{
            color:#4e5e7e;
        }
        select option{
            color:#7f889c;
        }
      input.form-control.proDes{width: 80%}
    }
</style>
